import { reactive, ref } from 'vue';

import { createInjectionState } from '@vueuse/core';
import { defu as merge } from 'defu';

import { baseConfig, type Config } from './config';

export function createBuilder(options?: Partial<Config>) {
  // const builder = new Builder()
  const config = reactive<Config>(merge(options || {}, baseConfig) as Config);
  const pageIndex = ref(0);
  const setConfig = (key: string, value: any) => {
    if (Reflect.has(config, key)) {
      config[key] = value;
    }
  };
  const getConfig = (key: string) => {
    return Reflect.has(config, key) ? config[key] : undefined;
  };
  return {
    config,
    setConfig,
    getConfig,
    pageIndex,
  };
}

const [initBuilder, useBuilder] = createInjectionState(createBuilder);

export { initBuilder };
export { useBuilder };
